<template>
  <div>
    <el-breadcrumb>
      <el-breadcrumb-item>首页</el-breadcrumb-item>
      <el-breadcrumb-item>设置</el-breadcrumb-item>
      <el-breadcrumb-item>{{id? '编辑协议单位':'新增协议单位'}}</el-breadcrumb-item>
    </el-breadcrumb>
    <div class="easy-content">
      <el-form label-width="120px"
        :rules="rules"
        ref="ruleForm"
        :model="agreementInfo">
        <div class="wrap">
          <p class="title">基础信息</p>
          <el-row>
            <el-col :span="12">
              <el-form-item label="单位类型"
                prop="baseInfo.typeId">
                <el-select placeholder="请选择单位类型"
                  clearable
                  v-model.trim="agreementInfo.baseInfo.typeId">
                  <el-option v-for="(item,index) in unitsTypes"
                    :key="index"
                    :label="item.name"
                    :value="item.name"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="单位等级">
                <el-select placeholder="请选择单位等级"
                  clearable
                  v-model.trim="agreementInfo.baseInfo.rankId">
                  <el-option v-for="(item,index) in ranks"
                    :key="index"
                    :label="item.name"
                    :value="item.name"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="客户来源"
                prop="baseInfo.clientId">
                <el-select placeholder="请选择客户来源"
                  clearable
                  v-model.trim="agreementInfo.baseInfo.clientId">
                  <el-option v-for="(item,index) in clients"
                    :key="index"
                    :label="item.name"
                    :value="item.name"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="单位地址">
                <el-cascader :options="cities"
                  placeholder="请选择单位地址"
                  :props="{ value: 'cityid', label: 'city', children: 'citiess' }"
                  v-model.trim="areaData"
                  @change="handleCascader"
                  filterable
                  clearable
                  change-on-select>
                </el-cascader>
              </el-form-item>
              <el-form-item label="详细地址">
                <el-input v-model.trim="agreementInfo.baseInfo.address"
                  clearable
                  maxlength="30"
                  placeholder="请输入详细地址"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12"
              class="fr">
              <el-form-item label="单位名称"
                prop="baseInfo.name">
                <el-input v-model.trim.trim="agreementInfo.baseInfo.name"
                  placeholder="请输入单位名称"
                  :disabled="isEdit"
                  maxlength="16"
                  clearable></el-input>
              </el-form-item>
              <el-form-item label="单位行业">
                <el-select placeholder="请选择单位行业"
                  clearable
                  v-model.trim="agreementInfo.baseInfo.industryId">
                  <el-option v-for="(item,index) in codes"
                    :key="index"
                    :label="item.name"
                    :value="item.name"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="市场来源"
                prop="baseInfo.bazaarId">
                <el-select placeholder="请选择市场来源"
                  clearable
                  v-model.trim="agreementInfo.baseInfo.bazaarId">
                  <el-option v-for="(item,index) in bazaars"
                    :key="index"
                    :label="item.name"
                    :value="item.name"></el-option>
                </el-select>
              </el-form-item>
              <el-row>
                <el-col :span="12">
                  <el-form-item label="营销员"
                    prop="baseInfo.salesman"
                    required>
                    <el-select placeholder="请选择营销员"
                      clearable
                      filterable
                      v-model.trim="agreementInfo.baseInfo.salesman">
                      <el-option v-for="(item,index) in marketPerson"
                        :key="index"
                        :label="item.name"
                        :value="item.id"></el-option>
                    </el-select>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="公司电话">
                    <el-input v-model.trim="agreementInfo.baseInfo.phone"
                      clearable
                      maxlength="11"
                      placeholder="请输入公司电话"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-form-item label="备注">
                <el-input type="textarea"
                  v-model.trim="agreementInfo.baseInfo.remark"
                  clearable
                  maxlength="50"
                  resize="none"
                  rows="5"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
        </div>
        <div class="wrap">
          <p class="title">单位联系人及账号
            <el-checkbox v-model="personSign"></el-checkbox>
          </p>
          <el-row>
            <el-col :span="12">
              <el-form-item label="单位联系人"
                prop="personInfo.person">
                <el-input placeholder="请输入单位联系人"
                  v-model.trim="agreementInfo.personInfo.person"
                  maxlength="8"
                  clearable></el-input>
              </el-form-item>
              <el-form-item label="证件种类">
                <el-select placeholder="请选择证件种类"
                  clearable
                  v-model.trim="agreementInfo.personInfo.identity">
                  <el-option v-for="(item,index) in papersList"
                    :key="index"
                    :label="item.papersType"
                    :value="item.papersType"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="证件有效期">
                <el-date-picker v-model.trim="agreementInfo.personInfo.deadline"
                  clearable
                  type="date"
                  value-format="yyyy-MM-dd"
                  :editable="false"
                  placeholder="请输入证件有效期">
                </el-date-picker>

              </el-form-item>
              <el-form-item label="开户行">
                <el-select placeholder="请选择开户行"
                  clearable
                  v-model.trim="agreementInfo.personInfo.bank">
                  <el-option v-for="(item,index) in banks"
                    :key="index"
                    :label="item.name"
                    :value="item.name"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="公司税号"
                prop="personInfo.taxNum">
                <el-input placeholder="请输入公司税号"
                  clearable
                  maxlength="20"
                  v-model.trim="agreementInfo.personInfo.taxNum"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12"
              class="fr">
              <el-form-item label="联系方式"
                prop="personInfo.phone">
                <el-input placeholder="请输入联系方式"
                  clearable
                  maxlength="11"
                  v-model.trim="agreementInfo.personInfo.phone"></el-input>
              </el-form-item>
              <el-form-item label="证件号">
                <el-input placeholder="请输入证件号"
                  clearable
                  maxlength="18"
                  v-model.trim="agreementInfo.personInfo.identityNum"></el-input>
              </el-form-item>
              <el-form-item label="生日">
                <el-date-picker v-model.trim="agreementInfo.personInfo.birthday"
                  :editable="false"
                  clearable
                  type="date"
                  placeholder="选择出身年月"
                  value-format="yyyy-MM-dd">
                </el-date-picker>
              </el-form-item>
              <el-form-item label="卡号">
                <el-input placeholder="请输入卡号"
                  clearable
                  maxlength="19"
                  v-model.trim="agreementInfo.personInfo.bankNum"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
        </div>
        <div class="wrap">
          <p class="title">合约信息
            <el-checkbox v-model="pactSign"></el-checkbox>
          </p>
          <el-row>
            <el-col :span="12">
              <el-form-item label="合同编号"
                prop="pactInfo.num">
                <el-input placeholder="请输入合同编号"
                  clearable
                  maxlength="24"
                  v-model.trim="agreementInfo.pactInfo.num"></el-input>
              </el-form-item>
              <el-form-item label="付款方式"
                prop="pactInfo.payId">
                <el-select placeholder="请选择付款方式"
                  clearable
                  v-model.trim="agreementInfo.pactInfo.payId">
                  <el-option v-for="(item,index) in payments"
                    :key="index"
                    :label="item.name"
                    :value="item.name"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="会议协议"
                prop="pactInfo.meetingId">
                <el-select placeholder="请选择会议协议"
                  @change="meetingPricesChange"
                  clearable
                  v-model.trim="agreementInfo.pactInfo.meetingId">
                  <el-option v-for="(item,index) in meetings"
                    :key="index"
                    :label="item.name"
                    :value="item.id"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12"
              class="fr">
              <el-form-item label="合同签署日期"
                prop="pactInfo.signTime">
                <el-date-picker v-model.trim="agreementInfo.pactInfo.signTime"
                  clearable
                  type="date"
                  value-format="yyyy-MM-dd"
                  :editable="false"
                  placeholder="请选择合同签署日期">
                </el-date-picker>
              </el-form-item>
              <el-form-item label="合同日期"
                prop="pactInfo.startTime">
                <el-date-picker type="daterange"
                  v-model.trim="startEndTime"
                  clearable
                  @change="setTime"
                  range-separator="至"
                  size="small"
                  value-format="yyyy-MM-dd"
                  :editable="false"
                  start-placeholder="起始日期"
                  end-placeholder="结束日期">
                </el-date-picker>
              </el-form-item>
            </el-col>
          </el-row>
          <el-form-item v-if="agreementInfo.pactInfo.meetingId">
            <el-table :data="priceMeetingHead.priceMeetings">
              <el-table-column prop="meetingName"
                label="会议厅">
              </el-table-column>
              <el-table-column prop="chuncuiMoney"
                label="全天价格">
              </el-table-column>
              <el-table-column prop="discountRate"
                v-if="show"
                label="折扣率（%）">
              </el-table-column>
              <el-table-column prop="discountMoney"
                label="折后价格">
              </el-table-column>
              <el-table-column prop="createTime"
                label="启动时间">
              </el-table-column>
              <el-table-column label="操作"
                width="400">
                <template slot-scope="scope">
                  <el-button type="text"
                    size="small"
                    @click='_getMeetingFestival(scope.row.festivalInfos)'>节日价格设置</el-button>
                </template>
              </el-table-column>
            </el-table>
          </el-form-item>
          <el-row>
            <el-col :span="12">
              <el-form-item label="房价协议"
                prop="pactInfo.headId">
                <el-select placeholder="请选择房价协议"
                  @change="agreementPricesChange"
                  clearable
                  v-model="agreementInfo.pactInfo.headId">
                  <el-option v-for="(item,index) in agreementPrices"
                    :key="index"
                    :label="item.name"
                    :value="item.id"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="房税结构"
                prop="pactInfo.roomTax">
                <el-select placeholder="请选择房税结构"
                  clearable
                  v-model.trim="agreementInfo.pactInfo.roomTax">
                  <el-option v-for="(item,index) in taxs"
                    :key="index"
                    :label="item.name"
                    :value="item.id"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <div v-if="!isCustom &&  agreementHead.agreements && agreementInfo.pactInfo.headId">
            <el-table :data="agreementHead.agreements">
              <el-table-column label="房型"
                prop="roomName">
              </el-table-column>
              <el-table-column :label="head.label"
                v-for="(head, key) in header"
                :key="key">
                <template slot-scope="scope">
                  {{agreementHead.agreements[scope.$index][head.key]}}
                  <span v-if="head.key =='discountRate' ||  head.key =='weekendDiscountRate'">%</span>
                </template>
              </el-table-column>
              <el-table-column label="启用时间"
                prop="startTime">
              </el-table-column>
              <el-table-column label="操作"
                width="200">
                <template slot-scope="scope">
                  <el-button type="text"
                    size="small"
                    @click="_getAgreementFestival(scope.row.festivals)">节日价格设置</el-button>
                </template>
              </el-table-column>
            </el-table>
          </div>
          <div v-if="isCustom && agreementHead.agreements">
            <el-form-item>
              <el-checkbox v-model.trim="isWeekend"
                @change="weekListChange"
                :disabled="agreementHead.agreements.length>0">是否设置周末价格</el-checkbox>
              <div class="weekList"
                v-if="isWeekend">
                <el-checkbox-group v-model="agreementInfo.pactInfo.weeks"
                  :disabled="agreementHead.agreements.length>0">
                  <el-checkbox v-for="item in weekList"
                    :key="item.id"
                    :label="item.id">{{item.title}}</el-checkbox>
                </el-checkbox-group>
              </div>
            </el-form-item>
            <el-form-item label="折扣类型：">
              <el-radio-group v-model="agreementInfo.pactInfo.type"
                @change="typeChange"
                :disabled="agreementHead.agreements.length>0">
                <el-radio :label="1">按比率折扣</el-radio>
                <el-radio :label="2">按折扣价格</el-radio>
              </el-radio-group>
            </el-form-item>
            <el-form-item>
              <el-button type="primary"
                size="small"
                class="fr"
                @click="_addRoomPrice">新增房型价格</el-button>
            </el-form-item>
            <el-form-item>
              <el-table :data="agreementHead.agreements">
                <el-table-column label="房型"
                  prop="roomName">
                </el-table-column>
                <el-table-column :label="head.label"
                  v-for="(head, key) in header"
                  :key="key">
                  <template slot-scope="scope">
                    {{agreementHead.agreements[scope.$index][head.key]}}
                    <span v-if="head.key =='discountRate' ||  head.key =='weekendDiscountRate'">%</span>
                  </template>
                </el-table-column>
                <el-table-column label="启用时间"
                  prop="startTime">
                </el-table-column>
                <el-table-column label="操作"
                  width="200">
                  <template slot-scope="scope">
                    <el-button type="text"
                      size="small"
                      @click="editRoomPrice(scope.row,scope.$index)">修改</el-button>
                    <el-button type="text"
                      size="small"
                      @click="_getAgreementFestival(scope.row.festivals,scope.$index)">节日价格设置</el-button>
                    <el-button type="text"
                      size="small"
                      @click="agreementHead.agreements.splice(scope.$index,1)">删除</el-button>
                  </template>
                </el-table-column>
              </el-table>
            </el-form-item>
          </div>
        </div>
        <div style="text-align:center;margin-top:20px;">
          <el-button size="small"
            type="primary"
            @click="_sure('ruleForm')">保存</el-button>
          <el-button size="small"
            @click="$router.back()">取消</el-button>
        </div>
      </el-form>
      <!-- 新增房型价格 -->
      <el-dialog :title="title"
        :visible.sync="dialogRoomPrice"
        width="400px">
        <el-form label-width="110px">
          <el-form-item label="房型："
            required>
            <el-select v-model.trim="room.roomId"
              @change="selectRoomType">
              <el-option v-for="(item,index) in roomTypeList"
                :key="index"
                :label="item.roomName"
                :value="item.roomId"
                :disabled="item.disabled"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="门市价："
            required>
            <el-input-number v-model="room.chuncuiMoney"
              controls-position="right"
              size="small"
              :min="0"
              :max="10000"
              :precision="2"
              disabled></el-input-number>
          </el-form-item>
          <el-form-item label="折后价格："
            required
            v-if="agreementHead.discountType == 2 ">
            <el-input-number v-model="room.discountMoney"
              controls-position="right"
              size="small"
              :min="0"
              :max="10000"
              :precision="2"></el-input-number>
          </el-form-item>
          <div v-if="agreementHead.discountType == 1">
            <el-form-item label="折扣比率："
              required>
              <el-input-number v-model="room.discountRate"
                controls-position="right"
                size="small"
                :min="0"
                :max="100"
                :precision="2"></el-input-number>&nbsp;&nbsp;
              <span>%</span>
            </el-form-item>
            <el-form-item label="折扣价格："
              v-if="room.discountRate && room.chuncuiMoney">
              ￥
              <span>{{sum}}</span>
            </el-form-item>
          </div>
          <div v-if="isWeekend">
            <el-form-item label="周末门市价格："
              required>
              <el-input-number v-model="room.weekendMoney"
                controls-position="right"
                size="small"
                :min="0"
                :max="10000"
                :precision="2"></el-input-number>
            </el-form-item>
            <!-- 周末折扣率 -->
            <div v-if="agreementHead.discountType == 1">
              <el-form-item label="周末折扣率："
                required>
                <el-input-number v-model="room.weekendDiscountRate"
                  controls-position="right"
                  size="small"
                  :min="0"
                  :max="100"
                  :precision="2"></el-input-number>&nbsp;&nbsp;
                <span>%</span>
              </el-form-item>
              <el-form-item label="周末折扣价格："
                v-if="room.weekendDiscountRate && room.weekendMoney">
                <span>{{_sum}}</span>
              </el-form-item>
            </div>
            <!-- 周末折扣价 -->
            <div v-if="agreementHead.discountType == 2">
              <el-form-item label="周末折扣价："
                required>
                <el-input-number v-model="room.weekendDiscountMoney"
                  controls-position="right"
                  size="small"
                  :min="0"
                  :max="10000"
                  :precision="2"></el-input-number>&nbsp;&nbsp;
              </el-form-item>
            </div>
          </div>

        </el-form>
        <span slot="footer"
          class="dialog-footer">
          <el-button @click="dialogRoomPrice = false">取 消</el-button>
          <el-button type="primary"
            @click="_sureRoomPrice">保存</el-button>
        </span>
      </el-dialog>
      <!-- 节假日查看 -->
      <el-dialog title="节假日设置"
        :visible.sync="dialogVisibleFestival"
        width="800px">
        <el-form :disabled="!isCustom">
          <el-form-item>
            <el-table :data="festivaList">
              <el-table-column label="起始时间 - 终止时间"
                width="260">
                <template slot-scope="scope">
                  <el-date-picker v-model.trim="scope.row.startEndTime"
                    size="small"
                    value-format="yyyy-MM-dd"
                    type="daterange"
                    range-separator="至"
                    start-placeholder="开始日期"
                    end-placeholder="结束日期">
                  </el-date-picker>
                </template>
              </el-table-column>
              <el-table-column prop="name"
                label="折扣类型">
                <template slot-scope="scope">
                  <el-select v-model="scope.row.type"
                    size="small">
                    <el-option label="按比率"
                      :value="1"></el-option>
                    <el-option label="按价格"
                      :value="2"></el-option>
                  </el-select>
                </template>
              </el-table-column>
              <el-table-column prop="name"
                width="200"
                label="房价">
                <template slot-scope="scope">
                  <el-input-number v-model="scope.row.roomPrice"
                    controls-position="right"
                    size="small"
                    :min="0"
                    :max="10000"
                    :precision="2"
                    v-show="scope.row.type==2"></el-input-number>
                  <el-input-number v-model="scope.row.roomPrice"
                    controls-position="right"
                    size="small"
                    :min="0"
                    :max="100"
                    :precision="2"
                    v-show="scope.row.type==1"></el-input-number>&nbsp;&nbsp;
                  <span v-show="scope.row.type==1"> %</span>
                </template>
              </el-table-column>
              <el-table-column label="操作"
                v-if="isCustom">
                <template slot-scope="scope">
                  <el-button size="small"
                    type="primary"
                    v-if="scope.$index == festivaList.length-1"
                    @click="_addFestival">
                    +
                  </el-button>
                  <el-button size="small"
                    @click="_reduceFestival(scope.$index)">
                    -
                  </el-button>
                </template>
              </el-table-column>
            </el-table>
          </el-form-item>
        </el-form>
        <span slot="footer"
          class="dialog-footer">
          <el-button @click="dialogVisibleFestival = false">取 消</el-button>
          <el-button type="primary"
            v-if="isCustom"
            @click="_sureFestival">确 定</el-button>
        </span>

      </el-dialog>
    </div>

  </div>
</template>

<script>
const cityData = require("@/data/addCities.json");
import {
  getPullList,
  getPerson,
  setProtocol_unit,
  getDetail
} from "@/public/js/agreement";
import { format } from "@/public/js/util";
import {
  getMeetingDetail,
  getAgreementDetail,
  getRoomTypeList
} from "@/public/js/price.js";
import validate from "@/public/js/validate";
export default {
  components: {},
  props: {},
  data() {
    return {
      rules: {
        "baseInfo.name": [
          { required: true, message: "请输入单位名称", trigger: "blur" }
        ],
        "baseInfo.typeId": [
          { required: true, message: "请输入单位类型", trigger: "change" }
        ],
        "baseInfo.bazaarId": [
          { required: true, message: "请选择市场来源", trigger: "change" }
        ],
        "baseInfo.clientId": [
          { required: true, message: "请选择客户来源", trigger: "change" }
        ],
        "baseInfo.salesman": [
          { required: true, message: "请选择营销员", trigger: "change" }
        ],
        "personInfo.taxNum": [
          { required: true, message: "请输入公司税号", trigger: "blur" }
        ],
        "personInfo.person": [
          { required: true, message: "请输入单位联系人", trigger: "blur" }
        ],
        "pactInfo.num": [
          { required: true, message: "请输入合同编号", trigger: "blur" }
        ],
        "pactInfo.signTime": [
          { required: true, message: "请选择合同签署日期", trigger: "blur" }
        ],
        "pactInfo.payId": [
          { required: true, message: "请选择付款方式", trigger: "change" }
        ],
        "pactInfo.startTime": [
          { required: true, message: "请选择合同日期", trigger: "change" }
        ],
        "pactInfo.meetingId": [
          { required: true, message: "请选择会议协议", trigger: "change" }
        ],
        "pactInfo.headId": [
          { required: true, message: "请选择房价协议", trigger: "change" }
        ],
        "personInfo.phone": [
          { required: true, message: "请输入手机号码", trigger: "blur" },
          { validator: validate.checkTelReg, trigger: "blur" }
        ],
        "pactInfo.roomTax": [
          { required: true, message: "请选择税务结构", trigger: "change" }
        ]
      },
      id: "",
      isEdit: false,
      isWeekend: false,
      personSign: "",
      pactSign: "",
      agreementInfo: {
        id: "",
        baseInfo: {
          num: "",
          name: "",
          typeId: "",
          industryId: "",
          rankId: "",
          bazaarId: "",
          clientId: "",
          salesman: "",
          phone: "",
          country: 1,
          provinceid: "",
          cityid: "",
          areaid: "",
          address: "",
          remark: ""
        },
        personInfo: {
          person: "",
          phone: "",
          identity: "",
          identityNum: "",
          deadline: "",
          birthday: "",
          bank: "",
          bankNum: "",
          taxNum: ""
        },
        pactInfo: {
          num: "",
          signTime: "",
          startTime: "",
          endTime: "",
          payId: "",
          meetingId: "",
          headId: "",
          roomTax: "",
          id: "",
          type: 1,
          weekend: "",
          weeks: [],
          agreement: []
        }
      },
      weekList: [
        {
          title: "一",
          id: "1",
          check: false
        },
        {
          title: "二",
          id: "2",
          check: false
        },
        {
          title: "三",
          id: "3",
          check: false
        },
        {
          title: "四",
          id: "4",
          check: false
        },
        {
          title: "五",
          id: "5",
          check: false
        },
        {
          title: "六",
          id: "6",
          check: false
        },
        {
          title: "日",
          id: "7",
          check: false
        }
      ],
      areaData: [],
      cities: cityData.provincesEntities,
      papersList: [],
      banks: [],
      unitsTypes: [],
      codes: [],
      ranks: [],
      bazaars: [],
      clients: [],
      taxs: [],
      payments: [],
      agreementPrices: [],
      meetings: [],
      marketPerson: [],
      priceMeetingHead: {},
      show: false,
      festivaList: [],
      dialogVisibleFestival: false,
      isCustom: false,
      header: [],
      agreementHead: {},
      startEndTime: [],
      title: "新增房型价格",
      dialogRoomPrice: false,
      roomTypeList: [],
      handle_index: "",
      //新增 房型数据
      room: {
        id: "",
        roomId: "",
        roomName: "",
        chuncuiMoney: "",
        discountRate: "",
        discountMoney: "",
        brokerage: "",
        weekendMoney: "",
        weekendDiscountRate: "",
        weekendDiscountMoney: "",
        startTime: "",
        festivals: []
      },
      disabled: true
    };
  },
  watch: {
    agreementHead: {
      handler(newVal) {
        if (newVal.discountType == 1) {
          if (newVal.weekend == 2) {
            this.header = [
              {
                label: "门市价",
                key: "chuncuiMoney"
              },
              {
                label: "正常折扣比率",
                key: "discountRate"
              },
              {
                label: "正常折扣价格",
                key: "discountMoney"
              }
            ];
          } else if (newVal.weekend == 1) {
            this.header = [
              {
                label: "正常门市价",
                key: "chuncuiMoney"
              },
              {
                label: "正常折扣比率",
                key: "discountRate"
              },
              {
                label: "正常折扣价格",
                key: "discountMoney"
              },
              {
                label: "周末门市价",
                key: "weekendMoney"
              },
              {
                label: "周末折扣率",
                key: "weekendDiscountRate"
              },
              {
                label: "周末折扣价格",
                key: "weekendDiscountMoney"
              }
            ];
          }
        } else if (newVal.discountType == 2) {
          if (newVal.weekend == 2) {
            this.header = [
              {
                label: "门市价",
                key: "chuncuiMoney"
              },
              {
                label: "折后价格",
                key: "discountMoney"
              }
            ];
          } else if (newVal.weekend == 1) {
            this.header = [
              {
                label: "正常门市价",
                key: "chuncuiMoney"
              },
              {
                label: "正常折后价",
                key: "discountMoney"
              },
              {
                label: "周末门市价",
                key: "weekendMoney"
              },
              {
                label: "周末折扣价格",
                key: "weekendDiscountMoney"
              }
            ];
          }
        }
      },
      deep: true
    },
    personSign(val) {
      this.rules["personInfo.person"][0].required = val;
      this.rules["personInfo.phone"][0].required = val;
      this.rules["personInfo.taxNum"][0].required = val;
    },
    pactSign(val) {
      this.rules["pactInfo.num"][0].required = val;
      this.rules["pactInfo.signTime"][0].required = val;
      this.rules["pactInfo.payId"][0].required = val;
      this.rules["pactInfo.startTime"][0].required = val;
      this.rules["pactInfo.meetingId"][0].required = val;
      this.rules["pactInfo.headId"][0].required = val;
      this.rules["pactInfo.roomTax"][0].required = val;
    }
  },
  computed: {
    sum() {
      this.room.discountMoney =
        parseFloat(this.room.chuncuiMoney) *
        parseFloat(this.room.discountRate) /
        100;
      return isNaN(this.room.discountMoney)
        ? ""
        : this.room.discountMoney.toFixed(2);
    },
    _sum() {
      this.room.weekendDiscountMoney =
        parseFloat(this.room.weekendMoney) *
        parseFloat(this.room.weekendDiscountRate) /
        100;
      return isNaN(this.room.weekendDiscountMoney)
        ? ""
        : this.room.weekendDiscountMoney.toFixed(2);
    }
  },
  methods: {
    weekListChange(value) {
      this.agreementHead.weekend = value ? 1 : 2;
    },
    typeChange(value) {
      this.agreementHead.discountType = value;
    },
    //获取房型列表
    _getRoomList() {
      getRoomTypeList().then(res => {
        this.roomTypeList = res.data.roomTypeList;
        this.roomTypeList.forEach(item => {
          this.agreementHead.agreements.forEach(i => {
            if (i.roomId == item.roomId) {
              item.disabled = true;
            }
          });
        });
      });
    },
    //选择房型
    selectRoomType(roomId) {
      this.roomTypeList.forEach((item, index) => {
        if (item.roomId == roomId) {
          this.room.chuncuiMoney = item.money;
          this.room.roomName = item.roomName;
          this.__index = index;
        }
      });
    },
    // 新增协议价格
    _addRoomPrice() {
      if (this.isWeekend && !this.agreementInfo.pactInfo.weeks.length) {
        this.$message.error("请选择要设置的星期");
        return false;
      }
      this._getRoomList();
      this.isAddRoomPrice = true;
      this.dialogRoomPrice = true;
      this.title = "新增房型价格";
      this.room = {
        id: "",
        roomId: "",
        roomName: "",
        chuncuiMoney: "",
        discountRate: "",
        discountMoney: "",
        brokerage: "",
        weekendMoney: "",
        weekendDiscountRate: "",
        weekendDiscountMoney: "",
        startTime: format(new Date().getTime(), "yyyy-MM-dd"),
        festivals: []
      };
    },
    // 修改房型价格
    editRoomPrice(data, __index) {
      this._getRoomList();
      this.isAddRoomPrice = false;
      this.handle_index = __index;
      this.dialogRoomPrice = true;
      this.title = "修改房型价格";
      this.room = JSON.parse(JSON.stringify(data));
    },
    // 保存新增房型价格
    _sureRoomPrice() {
      //表单验证
      if (!this.room.roomId) {
        this.$message.error("请选择房型");
        return false;
      }
      if (!this.room.chuncuiMoney) {
        this.$message.error("请输入门市价格");
        return false;
      }
      if (this.agreementHead.discountType == 1) {
        if (!this.room.discountRate) {
          this.$message.error("请输折扣率");
          return false;
        }
      } else if (this.agreementHead.discountType == 2) {
        if (!this.room.discountMoney) {
          this.$message.error("请输折扣价格");
          return false;
        }
      }
      if (this.isWeekend) {
        if (!this.room.weekendMoney) {
          this.$message.error("请输周末门市价");
          return false;
        }
        if (
          this.agreementHead.discountType == 1 &&
          this.agreementHead.chuncui == 2
        ) {
          if (!this.room.weekendDiscountRate) {
            this.$message.error("请输周末折扣率");
            return false;
          }
        } else if (this.agreementHead.discountType == 2) {
          if (!this.room.weekendDiscountMoney) {
            this.$message.error("请输周末折扣价");
            return false;
          }
        }
      }
      if (this.isAddRoomPrice) {
        this.agreementHead.agreements.push(this.room);
      } else {
        let room = this.agreementHead.agreements[this.handle_index];
        room.brokerage = this.room.brokerage;
        room.chuncuiMoney = this.room.chuncuiMoney;
        room.discountMoney = this.room.discountMoney;
        room.discountRate = this.room.discountRate;
        room.roomId = this.room.roomId;
        room.roomName = this.room.roomName;
        room.weekendDiscountMoney = this.room.weekendDiscountMoney;
        room.weekendDiscountRate = this.room.weekendDiscountRate;
        room.weekendMoney = this.room.weekendMoney;
      }
      this.dialogRoomPrice = false;
    },
    //地址选择
    handleCascader(val) {
      this.agreementInfopageNum = 1;
      this.agreementInfo.baseInfo.provinceid = val[0];
      this.agreementInfo.baseInfo.cityid = val[1];
      this.agreementInfo.baseInfo.areaid = val[2];
    },
    __init() {
      getPullList({ id: this.id }).then(res => {
        this.papersList = res.data.papersList;
        this.banks = res.data.banks;
        this.meetings = res.data.meetings;
        this.agreementPrices = res.data.agreementPrices
          ? res.data.agreementPrices
          : [];
        this.unitsTypes = res.data.unitsTypes;
        this.codes = res.data.codes;
        this.ranks = res.data.ranks;
        this.bazaars = res.data.bazaars;
        this.clients = res.data.clients;
        this.taxs = res.data.taxs;
        this.payments = res.data.payments;
        if (this.id) {
          this._getDetail();
        } else {
          this.rules["personInfo.person"][0].required = false;
          this.rules["personInfo.phone"][0].required = false;
          this.rules["personInfo.taxNum"][0].required = false;
          this.rules["pactInfo.num"][0].required = false;
          this.rules["pactInfo.signTime"][0].required = false;
          this.rules["pactInfo.payId"][0].required = false;
          this.rules["pactInfo.startTime"][0].required = false;
          this.rules["pactInfo.meetingId"][0].required = false;
          this.rules["pactInfo.headId"][0].required = false;
          this.rules["pactInfo.roomTax"][0].required = false;
        }
      });
      getPerson().then(res => {
        this.marketPerson = res.data.marketPerson;
      });
    },
    setTime(time) {
      this.agreementInfo.pactInfo.startTime = time ? time[0] : "";
      this.agreementInfo.pactInfo.endTime = time ? time[1] : "";
    },
    //协议房价
    agreementPricesChange(id) {
      this.agreementPrices.forEach(item => {
        if (item.id == id) {
          this.isCustom = item.custom == 1;
        }
      });
      console.log(this.agreementInfo.pactInfo)
      this._getAgreementDetail(id);
    },
    // 获取协议房间数据
    _getAgreementDetail(id) {
      getAgreementDetail({ id: id }).then(res => {
        if (res.data.agreementHead) {
          this.agreementHead = res.data.agreementHead;
          this.agreementInfo.pactInfo.weekend = res.data.agreementHead.weekend;
          this.agreementInfo.pactInfo.weeks = res.data.agreementHead.weeks;
          this.agreementInfo.pactInfo.type =
            res.data.agreementHead.discountType;
          this.isWeekend = res.data.agreementHead.weekend == 1;
        } else {
          this.agreementHead = {
            agreements: [],
            discountType: 1,
            id: "",
            weeks: [],
            weekend: 2
          };
          this.agreementInfo.pactInfo.weekend = 2;
          this.agreementInfo.pactInfo.weeks = [];
          this.agreementInfo.pactInfo.type = 1;
          this.isWeekend = false;
        }

        console.log( 'this.agreementInfo',this.agreementInfo)
      });
    },
    meetingPricesChange(id) {
      this._getMeetingDetail(id);
    },
    //获取会议协议数据
    _getMeetingDetail(id) {
      getMeetingDetail({ id: id }).then(res => {
        this.priceMeetingHead = res.data.priceMeetingHead || {};
        //this.show = this.priceMeetingHead.priceMeetings[0].discountRate != "";
      });
    },
    _getMeetingFestival(festivaList) {
      this._getFestival(festivaList);
    },
    _getAgreementFestival(festivaList, index) {
      this._getFestival(festivaList, index);
    },
    // 设置日期
    _getFestival(festivaList, index) {
      this.handle_index = index;
      if (!festivaList.length) {
        this.festivaList = [
          {
            id: "",
            startEndTime: [],
            type: 1,
            roomPrice: ""
          }
        ];
      } else {
        this.festivaList = [];
        festivaList.forEach(item => {
          this.festivaList.push({
            type: item.discountType,
            startEndTime: [item.startTime, item.endTime],
            roomPrice: item.roomPrice
          });
        });
      }

      this.dialogVisibleFestival = true;
    },
    // 新增 节日数据
    _addFestival() {
      this.festivaList.push({
        id: "",
        startEndTime: [],
        type: 1,
        roomPrice: ""
      });
    },
    // 删除 节日数据
    _reduceFestival(__index) {
      this.festivaList.splice(__index, 1);
    },
    // 保存节假日
    // 设置节日保存
    _sureFestival() {
      //表单验证
      let flag = false;
      this.festivaList.forEach(item => {
        if (!item.startEndTime.length) {
          this.$message.error("请输入开始时间结束时间");
          flag = true;
          return false;
        } else if (!item.roomPrice) {
          this.$message.error("请输入房价");
          flag = true;
          return false;
        }
      });
      if (!flag) {
        let festivaList = [];
        this.festivaList.forEach(item => {
          festivaList.push({
            roomPrice: item.roomPrice,
            startTime: item.startEndTime[0],
            endTime: item.startEndTime[1],
            discountType: item.type
          });
        });
        this.agreementHead.agreements[
          this.handle_index
        ].festivals = festivaList;
        this.dialogVisibleFestival = false;
      } else {
        this.agreementHead.agreements = [];
      }
    },
    //保存
    _sure(formName) {
      this.$refs[formName].validate(valid => {
        if (valid) {
          if (this.isCustom) {
            this.agreementInfo.pactInfo.weekend = this.isWeekend ? 1 : 2;
            this.agreementInfo.pactInfo.weeks = this.isWeekend
              ? this.agreementInfo.pactInfo.weeks
              : [];
            var agreement = [];
            this.agreementHead.agreements = this.agreementHead.agreements || [];
            if (!this.agreementHead.agreements.length && this.pactSign) {
              this.$message.error("请设置房型价格");
              return false;
            }
            this.agreementHead.agreements.forEach(item => {
              let festivals = [];
              item.festivals.forEach(i => {
                festivals.push({
                  id: i.id,
                  startTime: i.startTime,
                  endTime: i.endTime,
                  type: i.discountType,
                  roomPrice: i.roomPrice
                });
              });
              agreement.push({
                id: item.id,
                roomId: item.roomId,
                roomName: item.roomName,
                chuncuiMoney: item.chuncuiMoney,
                discountRate: item.discountRate,
                discountMoney: item.discountMoney,
                brokerage: item.brokerage,
                weekendMoney: item.weekendMoney,
                weekendDiscountRate: item.weekendDiscountRate,
                weekendDiscountMoney: item.weekendDiscountMoney,
                startTime: item.startTime,
                festivals: festivals
              });
            });
            this.agreementInfo.pactInfo.agreement = agreement;
          } else {
            this.agreementInfo.pactInfo.agreement = [];
          }
          if (this.agreementInfo.pactInfo.headId == 0) {
            this.agreementInfo.pactInfo.id = "";
          } else {
            this.agreementInfo.pactInfo.id = this.agreementInfo.pactInfo.headId;
          }
          this.agreementInfo.personSign = this.personSign ? 1 : 2;
          this.agreementInfo.pactSign = this.pactSign ? 1 : 2;
          setProtocol_unit(this.agreementInfo).then(res => {
            if (!res.data.errCode) {
              this.$message({
                type: "success",
                message: "操作成功"
              });
              this.$router.back();
            }
          });
        } else {
          console.log("error submit!!");
          return false;
        }
      });
    },
    //获取详情
    _getDetail() {
      getDetail({ id: this.id }).then(res => {
        let data = res.data.agreementUnitInfo;
        this.agreementInfo.id = this.id;
        this.agreementInfo.baseInfo.num = data.agreementNum;
        this.agreementInfo.baseInfo.name = data.agreementName;
        this.agreementInfo.baseInfo.typeId = data.type;
        this.agreementInfo.baseInfo.industryId = data.industry;
        this.agreementInfo.baseInfo.rankId = data.rank;
        this.agreementInfo.baseInfo.bazaarId = data.bazaar;
        this.agreementInfo.baseInfo.clientId = data.client;
        this.agreementInfo.baseInfo.salesman = data.salesmanId;
        this.agreementInfo.baseInfo.phone = data.companyPhone;
        this.agreementInfo.baseInfo.country = data.country;
        this.agreementInfo.baseInfo.industryId = data.industry;
        this.agreementInfo.baseInfo.provinceid = data.provinceid + "";
        this.agreementInfo.baseInfo.cityid = data.cityid + "";
        this.agreementInfo.baseInfo.areaid = data.areaid + "";
        this.areaData = [
          data.provinceid + "",
          data.cityid + "",
          data.areaid + ""
        ];
        this.agreementInfo.baseInfo.address = data.address;
        this.agreementInfo.baseInfo.remark = data.remark;
        this.agreementInfo.personInfo.person = data.contacts;
        this.agreementInfo.personInfo.phone = data.contactsNumber;
        this.agreementInfo.personInfo.identity = data.identityType;
        this.agreementInfo.personInfo.identityNum = data.identityNum;
        this.agreementInfo.personInfo.deadline = data.identityDeadline;
        this.agreementInfo.personInfo.birthday = data.birthday;
        this.agreementInfo.personInfo.bank = data.bank;
        this.agreementInfo.personInfo.bankNum = data.bankNum;
        this.agreementInfo.personInfo.taxNum = data.companyTaxNum;

        this.agreementInfo.pactInfo.num = data.pactNum;
        this.agreementInfo.pactInfo.signTime = data.pactSignTime;
        this.agreementInfo.pactInfo.startTime = data.startTime;
        this.agreementInfo.pactInfo.endTime = data.endTime;
        this.startEndTime = data.startTime ?  [data.startTime, data.endTime] : [];
        this.agreementInfo.pactInfo.payId = data.payMethod;
        this.agreementInfo.pactInfo.meetingId = data.agreementMeetingId;
        this._getMeetingDetail(data.agreementMeetingId);
        this.agreementInfo.pactInfo.headId = data.headId;
        this.agreementPricesChange(data.headId);
        this.agreementInfo.pactInfo.roomTax = data.structure;
        this.personSign = data.personSign == 1;
        this.pactSign = data.pactSign == 1;
      });
    }
  },
  created() {
    this.id = this.$route.query.id;
    this.isEdit = this.$route.query.id ? true : false;
    this.__init();
  },
  mounted() {}
};
</script>
<style lang="scss" scoped>
.easy-content {
  .el-date-editor,
  .el-cascader,
  .el-select {
    width: 100%;
  }
  .wrap {
    .title {
      color: #6d2377;
      text-align: left;
      font-size: 16px !important;
      height: 20px;
      margin-top: 20px;
      line-height: 20px;
      margin-bottom: 10px;
      font-weight: bold;
    }
  }
}
</style>